<template>
	<view class="change-tutoroal full box relative flex-col bg-white">
		<view class="tab-box">
			<u-tabs :bold="false" :height="100" :list="tabList" :is-scroll="false" v-model="current"
				@change="change"></u-tabs>
		</view>
		<view class="w-wrap">
			<view class="w-inner">
				<tab1-vue v-if="current===0" @apply="handleOpenForm" @reset="handleReset" />
				<tab2-vue v-if="current===1" />
			</view>
		</view>
		<form-popup ref="formRef" @confirm="handleApplyConfirm" />
	</view>
</template>

<script>
	import Tab1Vue from './tab1.vue';
	import Tab2Vue from './tab2.vue';
	import FormPopup from "./form-popup.vue"
	import { request, showLoading, toast } from '@/utils/tool';
	export default {
		components: {
			Tab1Vue,
			Tab2Vue,
			FormPopup
		},
		data() {
			return {
				current: 0,
				shebei_id: "",
				tabList: [{
					name: '帮助说明'
				}, {
					name: '滤芯记录'
				}]
			}
		},
		onLoad(ev) {
			const { shebei_id } = ev
			if (shebei_id) this.shebei_id = shebei_id
		},
		methods: {

			handleReset() {
				const { shebei_id } = this
				if (!shebei_id) return toast({ title: "未选择设备", icon: "error" })
				uni.showModal({
					title: "确认信息",
					content: "您确认要执行滤芯复位操作吗？",
					success: async ev => {
						if (ev.cancel) return
						const hide = showLoading("正在复位")
						const resp = await request({
							url: "/shebei/zhiling",
							data: {
								shebei_id,
								type: 3,
							}
						}).finally(hide)
						if (resp.code !== 1) {
							return toast({ title: resp.msg || "复位失败", icon: "error" })
						}
						toast({ title: "复位成功", icon: "success" })
					}
				})
			},
			async handleApplyConfirm(data) {
				const hide = showLoading("正在申请")
				const resp = await request({
					url: "/lvxin/add",
					data,
					method: "POST",
				}).catch(hide)
				hide()
				if (resp.code !== 1) {
					return toast({ title: resp.msg || "申请失败" })
				}
				toast({ title: '申请成功' })
			},
			handleOpenForm() {
				this.$refs.formRef.open()
				console.log('oepn');
			},
			change(ev) {
				this.current = ev
			}
		},
	}
</script>

<style lang="scss" scoped>
	.change-tutoroal {
		.tab-box {
			border-bottom: 2rpx solid #E7E7E7;
		}
	}
</style>